<template>
  <div class="home" :class="{hideMenu: menuShow}" v-loading.body="loading">
    <div class="leftMenu">
      <vSidebar></vSidebar>
    </div>
    <div class="rightContent">
      <div class="header">
        <vHeader></vHeader>
      </div>
      <div class="content">
        <transition name="move" mode="out-in"><router-view></router-view></transition>
      </div>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  import vSidebar from './menu.vue'
  import vHeader from './header.vue'
  import { mapState, mapActions } from 'vuex'
  export default {
    components: { vSidebar, vHeader },
    data () {
      return {
        loading: false
      }
    },
    computed: {
      ...mapState({
        menuShow: state => state.menuShow
      })
    },
    mounted () {
      this.getCityCodeList()
    },
    methods: {
      ...mapActions('moduleItem', ['getCityCodeList'])
    }
  }
</script>
